<template>
    <div class="home">
    </div>
</template>

<script>
export default {
    name: "gamepadConnect",
    data() {
        return {
            interval: null,//时间间隔
        };
    },
    created() {
        var _this = this;
        // 监听游戏手柄
        window.addEventListener("gamepadconnected", function(e) {
            var gp = navigator.getGamepads()[e.gamepad.index];
            console.log(gp);
            _this.startgamepad(); // 启动手柄
        });
        // 监听游戏手柄拔出
        window.addEventListener("gamepaddisconnected", function(e) {
            clearInterval(_this.interval); // 停止获取手柄数据
        });
    },
    methods: {
        // 启动手柄
        startgamepad() {
            var _this = this;
            // 每200ms 获取一次手柄数据，查看是否按下手柄按键
            this.interval = setInterval(function() {
                var gamepad = navigator.getGamepads()[0];
                _this.remoteSensing(gamepad.axes);
                _this.pressKey(gamepad.buttons);
            }, 200);
        },
        // 手柄遥感
        remoteSensing(arr) {
            console.log(arr);
            // 下面是个人测试的：
            // arr[0] -1 ~ 1 : 左手边 左 ~ 右
            // arr[1] -1 ~ 1 : 左手边 上 ~ 下
            // arr[2] -1 ~ 1 : 右手边 左 ~ 右
            // arr[3] -1 ~ 1 : 右手边 上 ~ 下
        },
        // 手柄按键
        pressKey(arr) {
            // console.log(arr);
            for (let i = 0; i < arr.length; i++) {
                if (arr[i].value == 1) {
                    console.log(i);
                    // 根据个人情况判断；不同手柄值不同。
                    if (i == 0) {
                        console.log("A");
                    }
                    if (i == 1) {
                        console.log("B");
                    }
                    if (i == 2) {
                        console.log("X");
                    }
                    if (i == 3) {
                        console.log("Y");
                    }

                    if (i == 4) {
                        console.log("左手1");
                    }
                    if (i == 5) {
                        console.log("右手1");
                    }
                    if (i == 6) {
                        console.log("左手2");
                    }
                    if (i == 7) {
                        console.log("右手2");
                    }

                    if (i == 8) {
                        console.log("BACK");
                    }
                    if (i == 9) {
                        console.log("START");
                    }

                    if (i == 10) {
                        console.log("左遥感按下");
                    }
                    if (i == 11) {
                        console.log("右遥感按下");
                    }

                    if (i == 12) {
                        console.log("上");
                    }
                    if (i == 13) {
                        console.log("下");
                    }
                    if (i == 14) {
                        console.log("左");
                    }
                    if (i == 15) {
                        console.log("右");
                    }
                }
            }
        },
    }
};
</script>

<style lang="scss" scoped>
.home {
    position: fixed;
    width: 100%;
    height: 100%;
}
</style>

